//
//  CardView.swift
//  SwiftUIScrollView
//
//  Created by 李煜 on 2024/7/31.
//

import SwiftUI

struct CardView: View {
  var image: String // 图片
  var category: String // 分类
  var heading: String // 标题
  var author: String // 作者
  var body: some View {
    VStack {
      Image(image) //"swiftui-button"
        .resizable()
        .aspectRatio(contentMode: .fit)
      HStack {
        VStack(alignment: .leading) {
          Text(category) //"SwiftUI"
            .font(.headline)
            .foregroundStyle(.secondary)
          Text(heading) //"Drawing a Border with Rounded Corners"
            .font(.title)
            .fontWeight(.black)
            .foregroundStyle(.primary)
            .lineLimit(3)
            .minimumScaleFactor(0.5) //可用空间缩放文字的最小比率
          Text("WRITEN BY \(author)") //SIMON NG
            .font(.caption)
            .foregroundStyle(.secondary)
        }
        Spacer()
      }
      .padding()
    }
    // 圆角
    .cornerRadius(10)
    // 边框
    .overlay {
      //注意lineWidth 太宽但屏幕宽度固定,导致rectangle重叠于下层视图,所以不要太宽
      RoundedRectangle(cornerRadius: 10)
        .stroke(Color(red: 150 / 255, green: 150 / 255, blue: 150 / 255, opacity: 0.3), lineWidth: 2)
    }
    .padding([.top,.horizontal])
//    .background(.blue)
  }
}

#Preview {
  CardView(image: "swiftui-button", category: "SwiftUI", heading: "Drawing a Border with Rounded Corners", author: "SIMON NG")
}
